<template>
	<!-- 学术期刊 -->
	<div id="periodical" class="periodical">
		<Header></Header>
		<!--本来应该是导航，（方便全局替换）-->
		<!-- <HHeader></HHeader> -->
		<div class="periodiCont">
			<div class="periodiCon_crumbs">
				<span>
					<router-link :to="{ name: 'home' }">首页</router-link>
				</span>
				<i class="iconfont icon-youjiantou"></i>
				<span>学术期刊</span>
			</div>
			<div class="periodiCon_cluster">
				<div class="periodiCon_cluster_Left">
					<div class="floorTitle">
						<span>期刊集群</span>
						<i class="iconfont icon-xiegang icon"></i>
						<span>PERIODICAL CLUSTER</span>
					</div>
					<div class="periodiCon_cluster_Cont periodiCon_cluster_Cont1cd">
						<ul>
							<li v-for="(item, index) in cluster" :key="index">
								<img :src="item.img" @click="toMenu(item.url)" />
								<p class="namedea" @click="toMenu(item.url)">
									<a href="##" :title="item.name">{{ item.name }}</a>
								</p>
								<!-- <div class="dinyu" style="width:65px;height:22px;background:#003c80;text-align:center;cusor:pointer;line-height:22px;"><i class="iconfont icon-pictrue-add" style="color:#fff;position:relative;font-size: 12px;left: -1px;top: inherit;"></i><span style="color:#fff;font-size:12px;">立即订阅</span></div> -->
								<div class="condivcover" @click="tougao(item)">
									<i class="iconfont icon-tougaoguanli" @click="tougao(item)"></i>
									<p>我要投稿</p>
								</div>
								<div class="mobileConDiv" @click="tougao(item)">
									<text>我要投稿</text>
								</div>
							</li>
							<div style="clear: both"></div>
						</ul>
					</div>
				</div>
				<div style="clear: both"></div>
			</div>
			<div class="periodiCon_dynamic">
				<div class="periodiCon_cluster_Left">
					<div class="floorTitle">
						<span>期刊动态</span>
						<i class="iconfont icon-xiegang"></i>
						<span>JOURNAM TRENDS</span>
					</div>
					<div class="periodiCon_cluster_Cont">
						<ul>
							<li v-for="(item, index) in flRseniorityD" :key="index"
								:class="{ clusterContA: clusterContA === index }" @click="clusterContA = index">
								<div>
									<span>
										<router-link :to="{
                        name: 'periodicaldetail',
                        query: { id: item.ContentID },
                      }">{{ item.Title }}</router-link>
									</span>
									<span>{{ item.AddDate }}</span>
								</div>
							</li>
							<!-- <el-pagination
                class="r"
                @size-change="handleSizeChange"
                @current-change="handleCurrentPageChange"
                :current-page="page.currentPage"
                :page-sizes="page.sizes"
                :page-size="pageSize"
                :total="page.total"
              ></el-pagination> -->
						</ul>
					</div>
				</div>
			</div>
		</div>

		<Alerts :flag="flag" @comfig="comfig"></Alerts>
	</div>
</template>
<script>
	// import router from "@/router/index";
	//juqery

	export default {
		inject: ["reload"],
		name: "periodical",
		data() {
			return {
				// 点击控制验证码
				modisabled: false,
				Lmurl: "http://bjlm.bosihw.cn",
				academicdetailCont: 0,
				clusterCont: 0,
				thesisB: 0,
				clusterContA: 0,
				cluster: [{
						url: "http://www.cjstp.cn",
						name: "中国科技期刊研究",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/9杂志.png",
						IsDredge: false
					},
					{
						url: "http://bjxb.cessp.org.cn",
						name: "编辑学报",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/10杂志.png",
						IsDredge: false
					},
					{
						url: "https://bjzy.sxpmg.com/",
						name: "编辑之友",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/12杂志.png",
						IsDredge: false
					},
					{
						url: "http://kjycb.tsinghuajournals.com/",
						name: "科技与出版",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/6杂志.png",
						IsDredge: false
					},
					{
						url: "http://www.dik.whu.edu.cn/",
						name: "出版科学",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/0杂志.png",
						IsDredge: false

					},
					{
						url: "https://zgcb.chinaxwcb.com/",
						name: "中国出版",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/8杂志.png",
						IsDredge: false
					},
					{
						url: "http://www.cbfxyjzz.cn/",
						name: "出版发行研究",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/4杂志.png",
						IsDredge: false
					},
					{
						url: "http://zgbianji.cn/",
						name: "中国编辑",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/7杂志.png",
						IsDredge: false
					},
					{
						url: "http://www.cbgjzz.cn/",
						name: "出版广角",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/2杂志.png",
						IsDredge: false
					},
					{
						url: "http://www.bjxuekan.cn/",
						name: "编辑学刊",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/11杂志.png",
						IsDredge: false
					},
					{
						url: "http://www.xdcbzzbjb.cn/",
						name: "现代出版",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/3杂志.png",
						IsDredge: false
					},
					{
						url: "https://cbyys.sppc.edu.cn/",
						name: "出版与印刷",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/5杂志.png",
						IsDredge: false
					},
					{
						url: "www.chuban.cc",
						name: "出版参考",
						img: "https://uniappfile.bosihw.cn/Res/BosihuiwenRes/bianjiimg/1杂志.png",
						IsDredge: false
					},
				],
				flRseniorityB: [],
				flRseniorityD: [],
				total: 5,
				periodiConList: [{
						num: 0,
						title: "全部期刊",
					},
					{
						num: 3,
						title: "北大核心",
					},
					{
						num: 4,
						title: "科技核心",
					},
					{
						num: 5,
						title: "国家级",
					},
					{
						num: 6,
						title: "省级",
					},
				],
				typeB: "",
				indexB: "",
				pageSize: 20,
				IsDredgeB: "",
				flag: false,

				// 弹框
				dialogFormVisible: false,
				// formLabelWidth: '10px',
				form: {
					email: this.$sessionStorage.getItem("userName"),
					code: "",
				},
				time: "获取验证码",
				JournalIdB: "",
				IsEmailVerifyB: "",
				page:{
					currentPage:1,
					total:0
				}
			};
		},
		methods: {
			comfig(type) {
				this.flag = false;
				if (type) {
					this.$uniRouter.push({
						path: "/login",
					});
				}
			},
			// 根据id获取用户个人信息
			getIdInfo() {
				let userName = this.$sessionStorage.getItem("userName");
				if (userName) {
					this.$httphelper
						.post("/api/LmUserApi/GetAuthorInfo", {
							openid: this.$localStorage.getItem("AuthorId"),
						})
						.then((res) => {
							this.IsEmailVerifyB = res.data.data.IsEmailVerify;
							this.$localStorage.setItem("IsEmailVerify", this.IsEmailVerifyB);
						})
						.catch((err) => {
							console.log("请求失败：" + "err");
						});
				}
			},
			getInfo() {
				this.page.currentPage = 1;
				// this.getTableData(0, 0);
			},
			toMenu(url) {
				// if (url.indexOf("http://") > -1) {
				// 	window.open(url);
				// } else {
				// 	window.open("http://" + url);
				// }
				uni.showModal({
					title: '请在PC端查看！',
					 duration: 2000
				})
			},
			// 热门下载
			getData() {
				this.$httphelper
					.post("/api/Lm/GetIssCountList", {
						Condition: 5,
						PageIndex: 1,
						PageSize: 5,
					})
					.then((res) => {
						this.flRseniorityB = res.data.Data.IssPounts;
					})
					.catch((err) => {
						console.log("请求失败：" + "err");
					});

				// axios.get('/api/Lm/GetPeriodicalList').then((res) => {
				//   this.cluster = res.data.Data
				//   this.cluster.forEach((e) => {
				//     e.siteImage = this.Lmurl+e.siteImage
				//   })
				// }).catch((err) => {
				//   console.log(err);
				// })
			},
			loogin(id) {
				if (!this.$sessionStorage.getItem('userName')) {
					this.flag = true
				} else {
					this.$uniRouter.push({
						path: "/academic/academicdetail",
						query: {
							id: id,
						},
					});
				}
			},
			getTableData(type, index) {
				this.clusterCont = index;
				this.typeB = type;
				this.indexB = index;
				this.$httphelper
					.post("/api/Lm/Getjournalofdynamics", {
						PageIndex: this.page.currentPage,
						PageSize: 20,
					})
					.then((res) => {
						this.flRseniorityD = res.data.Data.JournalInfos;
						this.flRseniorityD.forEach((item) => {
							item.AddDate = item.AddDate.substr(0, 10);
						});
						this.page.total = res.data.Data.TotalCount;
					})
					.catch((err) => {
						console.log("请求失败：" + "err");
					});

				// JournalType:心血管（1）医药期刊（2）
				// 获取期刊杂志列表
				// 加密完成
				this.$httphelper
					.post("/api/LmJournalApi/GetJournalPageList", {
						Type: type,
						Limit: 100,
						Page: 1,
						JournalType: 2,
					})
					.then((res) => {
						// this.cluster = res.data.data;
					})
					.catch((err) => {
						console.log("请求失败：" + "err");
					});
			},
			handleCurrentPageChange(val) {
				this.page.currentPage = val;
				// this.getTableData(this.typeB, this.indexB);
			},

			// 投稿
			tougao(item) {
				this.JournalIdB = item.JournalId;
				let userName = this.$sessionStorage.getItem("userName");
				if (userName) {
					if (item.IsDredge == false) {
						uni.showModal({
							title: '请在PC端查看！',
							 duration: 2000
						})
						return
						window.open(item.url);
					} else {
						if (this.IsEmailVerifyB == true) {
							this.$httphelper
								.post("/api/LmUserApi/GetSkipJournalLogin", {
									AuthorId: this.$localStorage.getItem("AuthorId"),
									JournalId: item.JournalId,
								})
								.then((res) => {
									uni.showModal({
										title: '请在PC端查看！',
										 duration: 2000
									})
									
									// window.open(res.data.data);
								})
								.catch((err) => {
									console.log(err);
								});
						} else {
							this.dialogFormVisible = true;
						}
					}
				} else {
					this.$confirm("请先登录", "提示", {
							customClass: "message-logout",
							confirmButtonText: "确定",
							cancelButtonText: "取消",
						})
						.then(() => {
							this.$uniRouter.push({
								path: "/login",
							});
						})
						.catch((e) => {
							console.log(e);
						});
				}
			},

			// 授权后跳转url跟tougao一样
			tougaoB() {
				this.$httphelper
					.post("/api/LmUserApi/GetSkipJournalLogin", {
						AuthorId: this.$localStorage.getItem("AuthorId"),
						JournalId: this.JournalIdB,
					})
					.then((res) => {
						window.open(res.data.data);
					})
					.catch((err) => {
						console.log("请求失败：" + "err");
					});
			},

			// 验证码
			gettime() {
				if (this.time == 0) {
					this.modisabled = false;
					clearInterval(this.close);
					this.time = "获取验证码";
				} else {
					this.time--;
				}
			},
			// 获取验证码
			getCode() {
				this.modisabled = true;
				if (this.form.email == "") {
					this.$message({
						message: "请输入邮箱号",
						type: "warning",
					});
				} else {
					this.$httphelper
						.post("/api/SmsEmailCodeApi/EmailCode", {
							MailBox: this.form.email,
						})
						.then((res) => {
							if (res.data.data == true) {
								this.time = 300;
								this.close = setInterval(this.gettime, 1000);
							} else {
								this.$message({
									message: "信息发送失败",
									type: "warning",
								});
							}
						})
						.catch((err) => {
							console.log("请求失败：" + "err");
						});
				}
			},

			// 点击确定绑定邮箱
			tosubmit() {
				// 判断验证码是否正确
				this.$httphelper
					.post("/api/SmsEmailCodeApi/SmsEmailCodeOk", {
						Mobile: this.form.email,
						VcStr: this.form.code,
					})
					.then((res) => {
						if (res.data.data == true) {
							this.$message({
								message: "验证码正确",
								type: "success",
							});
							// 邮箱授权
							// 加密完成
							this.$httphelper
								.post("/api/LmUserApi/UserEmailBound", {
									openid: this.$localStorage.getItem("AuthorId"),
								})
								.then((res) => {
									if (res.data.data == true) {
										this.$message({
											message: "邮箱授权成功",
											type: "success",
										});
										this.dialogFormVisible = false;
										this.reload();
										this.tougaoB();
									} else {
										this.$message({
											message: "邮箱授权失败",
											type: "warning",
										});
									}
								})
								.catch((err) => {
									console.log("请求失败：" + "err");
								});
						} else if (res.data.data == false) {
							this.$message({
								message: "验证码错误",
								type: "warning",
							});
						}
					})
					.catch((err) => {
						console.log("请求失败：" + "err");
					});
			},
		},
		onLoad() {
			this.getIdInfo();
			this.getData();
			this.getInfo();
		},
	};
</script>

<style lang="less" scoped>
	#periodical {
		width: 100%;
		height: auto;

		.periodiCont {
			width: 100%;
			height: 100%;

			.periodiCon_crumbs {
				height: 40rpx;
				margin: 0 auto;
				position: relative;
				margin-top: 56rpx;
				text-align: left;
				line-height: 40rpx;
				padding-left: 20rpx;

				span:nth-child(1) a {
					color: #000000;
					font-size: 32rpx;
					font-weight: bold;
					cursor: pointer;
				}

				i {
					color: #767c82;
					font-size: 36rpx;
					margin-left: 20rpx;
					font-weight: bold;
				}

				span:nth-child(3) {
					color: #003c80;
					font-size: 32rpx;
					margin-left: 20rpx;
					font-weight: bold;
					cursor: pointer;
				}
			}

			.periodiCon_cluster {
				margin: 0 auto;
				position: relative;
				// margin-top: 56rpx;

				.periodiCon_cluster_Left {
					height: auto;
					position: relative;
					float: left;

					.floorTitle {
						height: 70rpx;
						border-bottom: 4rpx solid #eee;
						position: relative;
						display: flex;

						.icon {
							width: 4rpx;
							height: 40rpx;
							background-color: #003c80;
							margin: 16rpx;
						}

						span:nth-child(1) {
							display: inline-block;
							font-size: 40rpx;
							color: #000;
							width: 170rpx;
							height: 70rpx;
							border-bottom: 4rpx solid #003c80;
							font-family: "Adobe Heiti Std R";
							font-weight: normal;
							line-height: 60rpx;
						}

						span:nth-child(3) {
							color: #797979;
							line-height: 78rpx;
							font-size: 28rpx;
							font-family: "Adobe Heiti Std R";
						}
					}

					.periodiCon_cluster_ContB {
						width: 100%;
						margin-top: 30rpx;
						position: relative;

						ul:nth-child(1) {
							width: 100%;
							height: 64rpx;
							position: relative;

							.clusterCont {
								background: #003c80;

								a {
									color: #fff !important;
								}
							}

							i {
								font-style: normal;
								font-size: 32rpx;
								position: absolute;
								color: #eee;
								top: 8rpx;
							}

							i:nth-child(2) {
								left: 14%;
							}

							i:nth-child(4) {
								left: 28%;
							}

							i:nth-child(6) {
								left: 45%;
							}

							i:nth-child(8) {
								left: 60%;
							}

							li {
								list-style: none;
								float: left;
								width: 206rpx;
								height: 64rpx;
								line-height: 64rpx;
								text-align: center;
								margin-right: 60rpx;

								a {
									color: #000000;
									font-size: 32rpx;
								}
							}
						}
					}

					.periodiCon_cluster_Cont1cd {
						.dinyu {
							width: 130rpx;
							height: 44rpx;
							background: #003c80;
							text-align: center;
							cursor: pointer;
							line-height: 44rpx;
							margin-left: 60rpx;
							margin-top: 30rpx;
						}

						.condivcover {
							width: 100%;
							height: 20%;
							position: absolute;
							bottom: 0rpx;
							background: rgba(0, 0, 0, 0.4);
							z-index: 99;
							display: none;

							i {
								font-size: 54rpx !important;
								position: relative !important;
								top: 6rpx !important;
								left: -66rpx !important;
								z-index: 999;
							}

							p {
								font-size: 28rpx !important;
								color: #fff !important;
								position: relative !important;
								z-index: 999;
								top: -62rpx;
								left: 28rpx;
							}
						}
					}

					.periodiCon_cluster_Cont {
						width: 100%;
						margin-top: 30rpx;

						ul:nth-child(1) {
							width: 100%;
							height: 64rpx;
							position: relative;

							.academCont {
								background: #003c80 !important;

								a {
									color: #fff;
								}
							}

							li {
								list-style: none;
								float: left;
								width: 184rpx;
								height: 64rpx;
								line-height: 64rpx;
								text-align: center;
								margin-right: 60rpx;
								position: relative;

								a {
									color: #000000;
									font-size: 32rpx;
								}
							}
						}
					}

					.periodiCon_cluster_Cont {
						width: 100%;
						margin-top: 30rpx;

						ul:nth-child(1) {
							width: 100%;
							height: 34rpx;
							position: relative;

							.clusterCont {
								background: #003c80;

								a {
									color: #fff !important;
								}
							}

							i {
								font-style: normal;
								font-size: 32rpx;
								position: absolute;
								color: #eee;
								top: 4px;
							}

							i:nth-child(2) {
								left: 14%;
							}

							i:nth-child(4) {
								left: 28%;
							}

							i:nth-child(6) {
								left: 45%;
							}

							i:nth-child(8) {
								left: 60%;
							}

							li {
								list-style: none;
								float: left;
								width: 4rpx;
								height: 34rpx;
								text-align: center;
								margin-right: 60rpx;

								a {
									color: #000000;
									font-size: 32rpx;
								}
							}
						}

						ul:nth-child(1),
						ul:nth-child(2),
						ul:nth-child(3),
						ul:nth-child(4),
						ul:nth-child(5) {
							width: 1712rpx;
							height: 100%;
							margin-top: 42rpx;

							p {
								font-size: 28rpx;
								font-family: SourceHanSansSC-Regular;
								font-weight: bold;
								color: #000;
								text-align: center;
								line-height: 46rpx;
								// overflow: hidden;
								// text-overflow: ellipsis;
								// display: -webkit-box;
								// -webkit-line-clamp: 2;
								// line-clamp: 2;
								// /* autoprefixer: off */
								// -webkit-box-orient: vertical;
								/* autoprefixer: on */
							}

							li:hover {
								.namedea {
									a {
										color: #003c80;
									}
								}

								.condivcover {
									display: block;
								}
							}

							li:nth-child(5n + 5) {
								margin-right: 0;
							}

							li {
								list-style: none;
								width: 268rpx;
								height: 368rpx;
								float: left;
								margin-right: 88rpx;
								cursor: pointer;
								margin-bottom: 104rpx;

								// overflow: hidden;
								img {
									width: 100%;
									height: 100%;
									transition: all 0.3s;
									border: 4rpx solid #c7c7c7;
									// animation: scaleDrew 2.5s ease-in-out infinite;
								}

								p {
									overflow: hidden;
									text-overflow: ellipsis;
									-webkit-line-clamp: 1;
									line-clamp: 1;
									white-space: nowrap;

									// animation: scaleDrew 2.5s ease-in-out infinite;
									a {
										color: #000;
									}
								}

								// div{
								//   margin-left: 60rpx;
								//   margin-top: 15px;
								// }
							}
						}
					}
				}

				.periodiCon_cluster_Right {
					width: 530rpx;
					float: right;
					border-left: 1px solid #eeeeee;
					position: relative;
					top: 66rpx;

					/deep/.flRseniority_just {
						margin-top: 56rpx !important;
					}

					.floRimg {
						width: 500rpx;
						height: 328rpx;
						margin-left: 38rpx;

						img {
							width: 100%;
							height: 100%;
						}
					}

					.flRseniority {
						width: 500rpx;
						height: 34rpx;
						margin-left: 38rpx;
						margin-top: 56rpx;

						span:nth-child(1) {
							float: left;
							width: 180rpx;
							height: 34rpx;
							color: #333;
							font-size: 40rpx;
							text-align: center;
							line-height: 44rpx;
							font-family: "SourceHanSansSC-Regular";
							border-bottom: 4rpx solid #003c80;
							cursor: pointer;
						}

						span:nth-child(2) {
							float: right;
							width: 314rpx;
							height: 34rpx;
							color: #333;
							line-height: 44rpx;
							font-size: 40rpx;
							text-align: left;
							border-bottom: 4rpx solid #eeeeee;
							cursor: pointer;
						}
					}

					.flrList {
						width: 500rpx;
						margin-left: 38rpx;
						margin-top: 20rpx;

						li:nth-child(1) {
							padding-top: 18rpx !important;
						}

						li:last-child {
							border-bottom: none;
							padding-bottom: 0px;
						}

						li:hover {
							a {
								color: #003c80;
							}

							span {
								color: #003c80;
							}
						}

						li {
							list-style: none;
							padding: 36rpx 0px;
							width: 100%;
							border-bottom: 2rpx solid #eeeeee;

							a {
								color: #333333;
								font-size: 28rpx;
								font-weight: bold;
							}
						}
					}

					.flrListB {
						a {
							display: inline-block;
							color: #333333;
							font-size: 28rpx;
							font-weight: bold;
							text-overflow: -o-ellipsis-lastline;
							overflow: hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-line-clamp: 2;
							line-clamp: 2;
							/* autoprefixer: off */
							-webkit-box-orient: vertical;
							/* autoprefixer: on */
							width: 100%;
						}
					}
				}
			}

			.periodiCon_dynamic {
				display: none;
				width: 2280rpx;
				height: 2380rpx;
				margin: 0 auto;
				position: relative;
				margin-top: 56rpx;

				.periodiCon_cluster_Left {
					width: 1712rpx;
					height: auto;
					position: relative;
					float: left;

					.floorTitle {
						width: 1712rpx;
						height: 70rpx;
						border-bottom: 4rpx solid #eee;
						position: relative;

						span:nth-child(1) {
							display: inline-block;
							font-size: 40rpx;
							color: #000;
							width: 170rpx;
							height: 70rpx;
							border-bottom: 4rpx solid #003c80;
							font-family: "Adobe Heiti Std R";
							font-weight: normal;
							line-height: 60rpx;
						}

						span:nth-child(3) {
							color: #797979;
							font-size: 28rpx;
							font-family: "Adobe Heiti Std R";
						}

						span:nth-child(4) {
							float: right;
							position: relative;
							top: 16rpx;

							a {
								color: #676767;
								font-size: 28rpx;
							}
						}
					}

					.periodiCon_cluster_Cont {
						width: 100%;
						margin-top: 56rpx;

						ul {
							width: 100%;

							// height: 1190px;
							.paperContLiA {
								background: #fff;

								div:nth-child(1) {
									span:nth-child(1) {
										a {
											color: #003c80;
										}
									}
								}
							}

							li:hover {
								background: #f7f8fa;

								div:nth-child(1) {
									span:nth-child(1) {
										a {
											color: #003c80;
										}
									}
								}
							}

							li {
								list-style: none;
								padding: 10rpx;
								// float: left;
								width: 100%;
								height: 150rpx;
								border-bottom: 2rpx solid #e6e6e6;
								position: relative;
								line-height: 40rpx;

								div {
									width: 98%;
									height: 40rpx;
									position: absolute;
								}

								div:nth-child(1) {
									top: 54rpx;

									span:nth-child(1) {
										float: left;
										width: 88%;
										overflow: hidden;
										text-overflow: ellipsis;
										-webkit-line-clamp: 1;
										line-clamp: 1;
										white-space: nowrap;

										a {
											color: #003c80;
											font-size: 62rpx;
										}
									}

									span:nth-child(2) {
										float: right;
										color: #909090;
										font-size: 32rpx;
									}
								}

								div:nth-child(2) {
									top: 71px;

									p {
										color: #8b8b8b;
										font-size: 28rpx;
										word-spacing: 20rpx;
										overflow: hidden;
										text-overflow: ellipsis;
										-webkit-line-clamp: 1;
										line-clamp: 1;
										white-space: nowrap;
									}
								}
							}
						}
					}
				}
			}
		}

		/deep/.el-dialog {
			width: 33%;
		}

		.regisCon_div {
			width: 80%;
			height: 74rpx;
			border: 2rpx solid #cbcbcb;
			margin-bottom: 38rpx;
			border-radius: 10rpx;
			position: relative;
			margin-left: 9%;

			i {
				color: #cbcbcb;
				position: relative;
				top: 10rpx;
				left: 18rpx;
			}

			.el-form-item {
				position: relative;
				top: -52rpx;
				width: 100%;
				height: 70rpx !important;

				/deep/.el-input__inner {
					border: none;
				}
			}

			.regis_hq {
				width: 184rpx;
				height: 72rpx;
				background: #003c80;
				// line-height:35px;
				text-align: center;
				color: #fff;
				font-size: 32rpx;
				cursor: pointer;
				position: absolute;
				right: -4rpx;
				top: 0;
				border-radius: 0 10rpx 10rpx 0;
				padding: 18rpx 12rpx;
			}
		}

		/deep/.el-dialog__header {
			border-bottom: 2rpx solid #efefef !important;
		}

		/deep/.el-input {
			width: 91%;
			margin-left: 9%;
		}

		/deep/.el-dialog__footer {
			border-top: 1px solid #efefef;
		}
	}

	/deep/.footBot {
		margin-top: 868rpx !important;
	}

	/deep/.el-pagination {
		position: absolute;
		width: 100%;
		text-align: center;
		bottom: -84rpx;
	}

	@media screen and (min-width: 1010px) {
		.mobileConDiv {
			display: none;
		}
	}

	@media screen and (max-width: 1010px) {
		.periodiCon_cluster_Right {
			display: none;
		}

		/deep/.condivcover {
			display: none !important;
		}

		.dinyu {
			margin-left: 26% !important;
		}

		.periodiCon_cluster_Cont {
			margin-bottom: 152rpx !important;
		}

		#periodical .periodiCont .periodiCon_dynamic .periodiCon_cluster_Left .periodiCon_cluster_Cont ul li {
			height: 170rpx;
		}

		#periodical .periodiCont .periodiCon_dynamic .periodiCon_cluster_Left .periodiCon_cluster_Cont ul li div:nth-child(1) span:nth-child(2) {
			margin-top: 16rpx;
		}

		#mofootBase {
			margin-top: 1180rpx !important;
		}

		/deep/.el-pagination__sizes {
			display: none !important;
		}

		/deep/.el-pagination {
			width: 100% !important;
			left: 0 !important;
			overflow: hidden;
			position: relative;
			bottom: -16rpx;
			overflow-x: auto;
		}

		.periodiCont {
			.periodiCon_crumbs {
				display: none;
			}

			.periodiCon_cluster {
				width: 94% !important;
				// margin-top: 104rpx !important;

				.periodiCon_cluster_Left {
					width: 100% !important;

					.floorTitle {
						width: 100% !important;
					}

					.periodiCon_cluster_ContB {
						width: 100%;
						overflow: hidden;
						overflow-x: auto;

						ul {
							width: 163% !important;

							li {
								width: 15% !important;
							}

							i {
								display: none;
							}
						}
					}

					.periodiCon_cluster_ContB::-webkit-scrollbar {
						display: none;
					}

					.periodiCon_cluster_Cont {
						ul {
							width: 100% !important;
							padding: 0 !important;

							li {
								margin-right: 20rpx !important;
								margin-left: 34rpx;
								width: 41% !important;
								position: relative;

								div {
									// margin-left: 26%!important;
								}
							}
						}
					}
				}
			}

			.periodiCon_dynamic {
				width: 94% !important;

				.periodiCon_cluster_Left {
					width: 100% !important;

					.floorTitle {
						width: 100% !important;
					}

					.periodiCon_cluster_Cont {
						width: 100% !important;
						margin-top: 0px !important;

						li {
							div:nth-child(1) {
								width: 94% !important;
								height: 45% !important;

								span {
									width: 100% !important;
									word-spacing: 20rpx;
									overflow: hidden;
									text-overflow: ellipsis;
									-webkit-line-clamp: 1;
									line-clamp: 1;
									white-space: nowrap;
								}
							}

							div:nth-child(2) {
								margin-top: 18rpx !important;
							}
						}
					}
				}
			}
		}

		.mobileConDiv {
			width: 100%;
			height: 62rpx;
			background: rgba(0, 0, 0, 0.5);
			position: absolute;
			bottom: 0;
			left: 0px !important;

			text {
				font-size: 28rpx;
				color: #fff;
			}
		}
	}

	@keyframes scaleDrew {

		/* 定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称 */
		0% {
			transform: scale(1);
		}

		25% {
			transform: scale(1.05);
		}

		50% {
			transform: scale(1);
		}

		75% {
			transform: scale(1.05);
		}
	}
</style>
<style>
	@media screen and (max-width: 1010px) {
		.message-logout {
			width: 80% !important;
		}
	}
</style>
